<template>
	<view class="container">
		
		
		<view class="main-content">
			<!-- 地块信息卡片 -->
			<view class="card">
				<view class="card-title-row">
					<text class="card-title">{{ fieldInfo.fieldName }}</text>
					<!-- <u-icon name="tree" color="#4CAF50" size="32"></u-icon> -->
				</view>
				<view class="card-subtitle" :style="{ color: '#7ed321' }">{{ fieldInfo.plotName }}</view>
				<view class="card-row">
					<text class="card-label">地块编号</text>
					<text class="card-value">{{ fieldInfo.plotId }}号</text>
				</view>
				<view class="card-row">
					<text class="card-label">地块面积</text>
					<text class="card-value">{{ fieldInfo.plotArea }}㎡</text>
				</view>
				<view class="card-row clickable" @click="showPickerService = true">
					<text class="card-label">服务类型</text>
					<text class="card-value">{{ fieldInfo.serviceName }}</text>
					<u-icon name="arrow-right" color="#bbb" size="18"></u-icon>
					<u-popup :show="showPickerService" mode="bottom" @close="showPickerService = false">
						<view class="picker-container">
							<view class="picker-header">
								<text class="cancel" @click="showPickerService = false">取消</text>
								<text class="title">选择服务类型</text>
								<text class="confirm" @click="confirmRentPeriodService">确定</text>
							</view>
							<picker-view class="picker-view" :indicator-style="indicatorStyle" :value="value" @change="bindChangeService">
							
								<picker-view-column >
									<view class="item" v-for="(item, index) in serviceType" :key="index">{{item.serviceName}}</view>
								
								</picker-view-column>
							</picker-view>
						</view>
					</u-popup>
				</view>
				<view class="card-row clickable" @click="showPicker = true">
					<text class="card-label">租赁周期</text>
					<text class="card-value">{{ fieldInfo.leastTime }}天</text>
					<u-icon name="arrow-right" color="#bbb" size="18"></u-icon>
					<u-popup :show="showPicker" mode="bottom" @close="showPicker = false">
						<view class="picker-container">
							<view class="picker-header">
								<text class="cancel" @click="showPicker = false">取消</text>
								<text class="title">选择租赁时长</text>
								<text class="confirm" @click="confirmRentPeriod">确定</text>
							</view>
							<picker-view class="picker-view" :indicator-style="indicatorStyle" :value="value" @change="bindChange">
								<picker-view-column>
									<view class="item" v-for="(item, index) in days" :key="index">{{item}}天</view>
								
								
								</picker-view-column>
							</picker-view>
						</view>
					</u-popup>
				</view>
			</view>

			<!-- 种子管理卡片 -->
			<view class="card">
				<view class="card-title-row">
					<text class="card-title" style="color:#4CAF50;">种子管理</text>
					<view class="card-action" @click="chooseSeed">选择种子<u-icon name="arrow-right" color="#bbb" size="18"></u-icon></view>
				</view>
				<view class="add-seed-btn-row" v-if="this.seedToOrder.selectedArea == 0">
					<button class="add-seed-btn" @click="chooseSeed" >+添加种子</button>
				</view>
				<view class="card-detail-row" v-else>
				
					<view 
						v-for="item in seedToOrder.seedList" 
						:key="item.cropId" 
						style="border-bottom: 1rpx solid #f5f5f5; padding: 16rpx 0; width: 100%;"
					>
						<view 
							class="card-detail-item-content" 
							style="display: flex; align-items: center; width: 100%;"
						>
							<image 
								:src="item.cropImg" 
								class="card-detail-img" 
								mode="aspectFill" 
								style="width: 72rpx; height: 72rpx; border-radius: 8rpx; margin-right: 24rpx;"
							></image>
							<view 
								class="card-detail-info" 
								style="flex: 1; display: flex; flex-direction: column; justify-content: center;"
							>
								<view 
									class="card-detail-name" 
									style="font-size: 30rpx; color: #444; margin-bottom: 4rpx;font-weight: bold;"
								>
									{{ item.cropName }}
									
								</view>
								<view class="card-detail-price">¥{{ item.cropPrice }}</view>
							</view>
							<view 
								class="card-detail-num" 
								style="font-size: 28rpx; color: #888; min-width: 80rpx; text-align: right;"
							>
								{{ item.cropNum }}m²
							</view>
						</view>
					</view>
				</view>
				<!-- <view class="card-detail-row">
					<text class="card-detail">详情</text>
					<u-icon name="arrow-down" color="#bbb" size="18"></u-icon>
				</view> -->
			</view>

			<!-- 收货地址选择 -->
			<view class="address-section" @click="selectAddress">
				<view class="address-content" v-if="!selectedAddress">
					<u-icon name="map" color="#4CAF50" size="20"></u-icon>
					<text class="address-text">请选择收货地址</text>
				</view>
				<view class="selected-address-content" v-else>
					<view class="address-header">
						<u-icon name="map" color="#4CAF50" size="20"></u-icon>
						<text class="address-label">收货地址</text>
					</view>
					<view class="address-info">
						<view class="user-info">
							<text class="name">{{selectedAddress.addressName}}</text>
							<text class="phone">{{selectedAddress.addressPhone}}</text>
						</view>
						<view class="address-detail">{{selectedAddress.addressInfo}} {{selectedAddress.addressCommunity}}</view>
					</view>
				</view>
				<u-icon name="arrow-right" color="#999" size="16"></u-icon>
			</view>
		</view>

		
		<!-- 底部支付栏 -->
		<view class="bottom-pay">
			<view class="pay-info">
				<text class="pay-label">实付款</text>
				<text class="pay-amount">¥ {{ totalPrice }}</text>
			</view>
			<view class="pay-btn" @click="submitOrder">
				提交订单
			</view>
		</view>
		<!-- 支付方式选择弹出层 -->
		<u-popup :show="paymentVisible" mode="bottom" :round="20" @close="closePayment" :safe-area-inset-bottom="true">
			<view class="payment-popup">
				<view class="payment-header">
					<view class="payment-title">支付金额</view>
					<u-icon name="close" @click="closePayment" size="20" color="#999"></u-icon>
				</view>
				<view class="payment-amount">¥ {{totalPrice}}</view>
				
				<view class="payment-methods">
					<!-- 微信支付 -->
					<view 
						class="payment-item" 
						:class="{ active: selectedPaymentType === 'wechat' }"
						@click="selectPaymentType('wechat')"
					>
						<view class="payment-info">
							<view class="payment-icon wechat-icon">
								<text>微</text>
							</view>
							<view class="payment-details">
								<view class="payment-name">微信支付</view>
								<view class="payment-desc">推荐使用微信支付</view>
							</view>
						</view>
						<view class="payment-radio">
							<view 
								class="radio-icon"
								:class="{ selected: selectedPaymentType === 'wechat' }"
							>
								<view v-if="selectedPaymentType === 'wechat'" class="radio-dot"></view>
							</view>
						</view>
					</view>
					
					<!-- 余额支付 -->
					<view 
						class="payment-item" 
						:class="{ active: selectedPaymentType === 'balance' }"
						@click="selectPaymentType('balance')"
					>
						<view class="payment-info">
							<view class="payment-icon balance-icon">
								<text>¥</text>
							</view>
							<view class="payment-details">
								<view class="payment-name">余额支付</view>
								<view class="payment-desc">可用余额 ¥{{userBalance}}</view>
							</view>
						</view>
						<view class="payment-radio">
							<view 
								class="radio-icon"
								:class="{ selected: selectedPaymentType === 'balance' }"
							>
								<view v-if="selectedPaymentType === 'balance'" class="radio-dot"></view>
							</view>
						</view>
					</view>
				</view>
				
				<view class="payment-footer">
					<view class="confirm-payment-btn" @click="confirmPayment">
						确认支付
					</view>
				</view>
			<!-- 输入支付密码 -->
			<u-popup :show="showPasswordPopup" mode="center" @close="showPasswordPopup = false">
				<view class="password-popup">
					<view class="popup-title">请输入支付密码</view>
					<input 
						type="password" 
						placeholder="请输入6位支付密码" 
						maxlength="6"
						v-model="payPassword"
						class="password-input"
					/>
					<view class="popup-btns">
						<view class="btn cancel" @click="showPasswordPopup = false">取消</view>
						<view class="btn confirm" @click="submitPayPassword">确定</view>
					</view>
				</view>
			</u-popup>
			</view>
		</u-popup>
	</view>
</template>

<script > 
import request from 'util/request.js'
	export default {
		data() {
			return {
				fieldInfo: {},
				days: [31,90,365],
				seedToOrder: {},
				serviceType: [{serviceName: '服务1', servicePrice: 5}, {serviceName: '服务2', servicePrice: 3}, {serviceName: '服务3', servicePrice: 0}],
				value: [0],
				indicatorStyle: 'height: 50px;',
				showPicker: false,
				showPickerService: false,
				totalPrice:0,
				paymentVisible:false,
				selectedPaymentType: 'wechat',
				userBalance: 0,
				//支付密码
				showPasswordPopup: false,
				payPassword: '',
				plotOrderNum:"",
				selectedAddress:null,
				cropOrderList:[]
			}
		},
		methods: {
			// 选择收货地址
			selectAddress() {
				console.log('点击选择收货地址');
				uni.navigateTo({
					url: '/pages/farm/selectAddress',
					fail: (err) => {
						console.error('页面跳转失败:', err);
						uni.showToast({
							title: '页面跳转失败',
							icon: 'none'
						});
					}
				});
			},
			setSelectedAddress(address) {
				this.selectedAddress = address;
				console.log('选中的地址:', address);
			},
			//选择支付方式
			selectPaymentType(type) {
				this.selectedPaymentType = type;
			},
			closePayment() {
				this.paymentVisible = false;
			},
			//显示支付选项
			submitOrder() {
				this.paymentVisible = true;
				console.log(this.plotOrderNum,"plotOrderNum")
				request({
					url: `/land-service/land/addOrder`,
					method: 'POST',
					data: {
						userId: uni.getStorageSync('userInfo').userId,
						// userPayPwd: this.payPassword,
						orderAmount: this.totalPrice,
						plotId: this.fieldInfo.plotId,
						leastTime: this.fieldInfo.leastTime,
						serviceId: this.fieldInfo.serviceId,
						plotPrice: this.fieldInfo.plotPrice,
						totalPrice: this.totalPrice,
						plotOrderNum:this.plotOrderNum,
						addressId:this.selectedAddress.addressId,
						cropOrderList:this.cropOrderList
					}
				}).then(res => {
					console.log(res)
				})
			},
			//跳转到种植选择页面
			chooseSeed() {
				
				// 数据提交
				uni.setStorageSync('fieldOrder',{seedList:this.fieldInfo.seedList,plotArea:this.fieldInfo.plotArea,plotOrderNum:this.plotOrderNum} )
				uni.setStorageSync('fieldInfo',this.fieldInfo)
				console.log(this.fieldInfo.seedList,this.fieldInfo.plotArea,"275--------------------")
				uni.redirectTo({
					url: '/pages/farm/seedList'
				});
			},
			// goBack() { uni.navigateBack(); },
			chooseService() { 
				/* 跳转或弹窗选择服务类型 */ 
			},
			bindChange(e) {
				this.value = e.detail.value;
				this.fieldInfo.leastTime = this.days[this.value[0]];
				console.log(this.fieldInfo.servicePrice)
				console.log(this.fieldInfo.leastTime)
				// this.totalPrice = Number(this.fieldInfo.servicePrice * this.fieldInfo.leastTime) + this.seedToOrder.totalPrice+this.fieldInfo.plotPrice;
			},
			bindChangeService(e) {
				this.value = e.detail.value;
				this.fieldInfo.serviceName = this.serviceType[this.value[0]].serviceName;
				this.fieldInfo.servicePrice = this.serviceType[this.value[0]].servicePrice;
				console.log(this.fieldInfo.servicePrice,"bindChangeService")
				// this.fieldInfo.servicePrice = this.serviceType[this.value[0]].servicePrice;
			},
			confirmRentPeriod() {
				this.showPicker = false;
			},
			confirmRentPeriodService() {
				this.showPickerService = false;
			},
			//确认支付
			confirmPayment() {
				
				this.showPasswordPopup = true;
			},
			//提交支付密码
			submitPayPassword() {
				request({
					url: `/land-service/land/payOrder`,
					method: 'POST',
					data: {
						userPayPwd: this.payPassword,
						serviceId: this.fieldInfo.serviceId,
						plotId: this.fieldInfo.plotId,
						plotOrderNum:this.plotOrderNum,
						orderAmount: this.totalPrice,
						leastTime: this.fieldInfo.leastTime,
						userId: uni.getStorageSync('userInfo').userId
					}
				}).then(res => {
					this.showPasswordPopup = false;
					if(res.code == 200) {
						uni.showToast({
							title: res.message,
							icon: 'success'
						});
						// 跳转到指定页面，延迟以保证toast显示
						setTimeout(() => {
							uni.navigateBack({
								delta: 2
							});
						}, 1200);
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none'
						});
					}
				})
			},
			//获取服务列表
			getServiceList() {
				request({
					url: `/land-service/land/getTypes`,
					method: 'GET',
				}).then(res => {
					if(res.code == 200) {
						this.serviceType = res.data.types;
						console.log(this.serviceType)
					}
				})
			},
			choosePeriod() { /* 跳转或弹窗选择周期 */ },
		
			addSeed() { /* 添加种子逻辑 */ }
		},
		onLoad() {
			this.fieldInfo = uni.getStorageSync('fieldInfo');
			console.log(this.fieldInfo , 'fieldInfo')
			this.totalPrice = this.fieldInfo.plotPrice+this.fieldInfo.servicePrice*this.fieldInfo.leastTime;
			this.getServiceList();
			this.seedToOrder = uni.getStorageSync('seedToOrder');
			console.log(this.seedToOrder,"seedToOrder")
			this.cropOrderList=this.seedToOrder.seedList.map(item => {
									return {
										cropId: item.cropId,
										cropArea: item.cropArea
									};
								});

			
			this.plotOrderNum = uni.getStorageSync('plotOrderNum');
			console.log(this.plotOrderNum,"plotOrderNum")
			request({
				url: `/user-service/user/balance`,
				method: 'GET',
				data: {
					userId: uni.getStorageSync('userInfo').userId
				}
			}).then(res => {
				if(res.code == 200) {
					this.userBalance = res.data.balance;
				}
			})
			//生成订单号
			if(!this.plotOrderNum){
			request({
				url: `/land-service/land/generateOrderNo`,
				method: 'GET',
				
			}).then(res => {
				if(res.code == 200) {
					this.plotOrderNum = res.data.plotOrderNum;
					console.log(this.plotOrderNum,"plotOrderNum")
				}
			})
	     	}
		},
		mounted() {
			
			this.userBalance = request({
				url: `/user-service/user/balance`,
				method: 'GET',
				data: {
					userId: uni.getStorageSync('userInfo').userId
				}
			}).then(res => {
				console.log(res,"res")
				if(res.code == 200) {
					this.userBalance = res.data.balance;
				}
			})
		},
		watch: {
			
			'fieldInfo.leastTime'(newVal) {
				// 重新计算总价
				this.totalPrice = Number(this.fieldInfo.plotPrice) + Number(this.fieldInfo.servicePrice) * Number(newVal);
				console.log(this.totalPrice,"watchPrice")
			},
			'fieldInfo.servicePrice'(newVal) {
				// 重新计算总价
				this.totalPrice = Number(this.fieldInfo.plotPrice) + Number(newVal) * Number(this.fieldInfo.leastTime);
				console.log(this.totalPrice,"watchServicePrice")
			},
			'seedToOrder.totalPrice'(newVal) {
				this.totalPrice = Number(this.fieldInfo.plotPrice) + Number(this.fieldInfo.servicePrice) * Number(this.fieldInfo.leastTime)+Number(newVal);
				console.log(this.totalPrice,"watchtotalPrice")
			}
			
		},
		
		
	}
</script>

<style scoped>
.container {
		background-color: #f5f5f5;
		min-height: 100vh;
		padding-bottom: 120rpx;
	}
	
	/* 自定义导航栏 */

	
	
	
	/* 主内容区域 */
	.main-content {
		padding: 120rpx 24rpx 160rpx 24rpx;
	}
	
	/* 收货地址选择 */
	.address-section {
		background-color: #ffffff;
		padding: 30rpx;
		margin-bottom: 20rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	
	.address-content {
		display: flex;
		align-items: center;
	}
	
	.address-text {
		font-size: 28rpx;
		color: #333;
		margin-left: 15rpx;
	}
	
	/* 商品信息 */
	.product-section {
		background-color: #ffffff;
		padding: 30rpx;
		margin-bottom: 20rpx;
	}
	
	.product-item {
		display: flex;
		align-items: center;
	}
	
	.product-image {
		width: 120rpx;
		height: 120rpx;
		border-radius: 12rpx;
		margin-right: 20rpx;
		flex-shrink: 0;
	}
	
	.product-details {
		flex: 1;
	}
	
	.product-title {
		font-size: 28rpx;
		color: #333;
		margin-bottom: 15rpx;
		font-weight: 500;
	}
	
	.product-price-row {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	
	.product-price {
		font-size: 26rpx;
		color: #FF5722;	
		font-weight: bold;
	}
	
	.product-quantity {
		font-size: 26rpx;
		color: #666;
	}
	
	/* 优惠券选择 */
	.coupon-section {
		background-color: #ffffff;
		padding: 30rpx;
		margin-bottom: 20rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	
	.coupon-content {
		display: flex;
		align-items: center;
	}
	
	.coupon-text {
		font-size: 28rpx;
		color: #333;
		margin-left: 15rpx;
	}
	
	.coupon-right {
		display: flex;
		align-items: center;
	}
	
	.coupon-status {
		font-size: 26rpx;
		color: #999;
		margin-right: 10rpx;
	}
	
	/* 价格明细 */
	.price-section {
		background-color: #ffffff;
		padding: 30rpx;
		margin-bottom: 20rpx;
	}
	
	.price-item {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-bottom: 25rpx;
	}
	
	.price-item:last-child {
		margin-bottom: 0;
	}
	
	.price-label {
		font-size: 28rpx;
		color: #333;
	}
	
	.price-value {
		font-size: 28rpx;
		color: #333;
		font-weight: 500;
	}
	
	.price-discount {
		font-size: 28rpx;
		color: #FF5722;
		font-weight: 500;
	}
	
	/* 底部支付栏 */
	.bottom-pay {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		height: 120rpx;
		background-color: #ffffff;
		border-top: 1rpx solid #f0f0f0;
		display: flex;
		align-items: center;
		padding: 0 30rpx;
		z-index: 1000;
	}
	
	.pay-info {
		flex: 1;
		display: flex;
		align-items: center;
	}
	
	.pay-label {
		font-size: 28rpx;
		color: #333;
		margin-right: 15rpx;
	}
	
	.pay-amount {
		font-size: 36rpx;
		color: #FF5722;
		font-weight: bold;
	}
	
	.pay-btn {
		background-color: #4CAF50;
		color: #ffffff;
		font-size: 32rpx;
		font-weight: bold;
		padding: 20rpx 60rpx;
		border-radius: 40rpx;
		text-align: center;
	}
	
	.card {
		background: #fff;
		border-radius: 18rpx;
		box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.04);
		margin-bottom: 30rpx;
		padding: 32rpx 28rpx 18rpx 28rpx;
	}
	
	.card-title-row {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 8rpx;
	}
	
	.card-title {
		font-size: 32rpx;
		font-weight: bold;
		color: #222;
	}
	
	.card-subtitle {
		font-size: 26rpx;
		margin-bottom: 18rpx;
	}
	
	.card-row {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		padding: 12rpx 0;
		border-bottom: 1rpx solid #f5f5f5;
	}
	
	.card-row:last-child {
		border-bottom: none;
	}
	
	.card-label {
		color: #bbb;
		font-size: 26rpx;
		width: 160rpx;
	}
	
	.card-value {
		color: #222;
		font-size: 28rpx;
		flex: 1;
	}
	
	.clickable {
		cursor: pointer;
	}
	
	.card-action {
		color: #bbb;
		font-size: 24rpx;
		display: flex;
		align-items: center;
	}
	
	.add-seed-btn-row {
		display: flex;
		justify-content: center;
		margin: 18rpx 0;
	}
	
	.add-seed-btn {
		border: 1rpx solid #4CAF50;
		color: #4CAF50;
		background: #fff;
		border-radius: 40rpx;
		padding: 10rpx 40rpx;
		font-size: 28rpx;
	}
	
	.card-detail-row {
		/* display: flex;
		align-items: center;
		justify-content: center;
		color: #bbb;
		font-size: 24rpx;
		margin-top: 10rpx; */
	}
	.picker-container {
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
	}
	.picker-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 20rpx;
		border-bottom: 1rpx solid #f0f0f0;
	}
	.picker-header text {
		font-size: 32rpx;
		font-weight: bold;
		color: #333;
	}
	.picker-header text.cancel {
		color: #888;
	}
	.picker-header text.confirm {
		color: #4CAF50;
	}
	.picker-view {
		width: 750rpx;
		height: 600rpx;
		margin-top: 20rpx;
	}
	.picker-view .item {
		text-align: center;
		line-height: 50px;
	}
	.cancel {
		color: #888;
	}
	.confirm {
		color: #4CAF50;
	}
	.title {
		font-size: 32rpx;
		color: #333;
	}
	/* 支付方式选择 */
	.payment-popup {
		padding: 30rpx;
		background-color: #ffffff;
	}
	
	.payment-header {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-bottom: 30rpx;
	}
	
	.payment-title {
		font-size: 32rpx;
		font-weight: bold;
		color: #333;
	}
	
	.payment-amount {
		font-size: 48rpx;
		color: #999;
		font-weight: bold;
		text-align: center;
		margin-bottom: 40rpx;
	}
	
	.payment-methods {
		margin-bottom: 40rpx;
	}
	
	.payment-item {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 30rpx 20rpx;
		border: 1rpx solid #f0f0f0;
		border-radius: 10rpx;
		margin-bottom: 20rpx;
		transition: all 0.3s;
	}
	
	.payment-item.active {
		border-color: #4CAF50;
		background-color: #f8fff8;
	}
	
	.payment-info {
		display: flex;
		align-items: center;
		flex: 1;
	}
	
	.payment-icon {
		width: 50rpx;
		height: 50rpx;
		margin-right: 20rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 8rpx;
	}
	
	.wechat-icon {
		background-color: #09bb07;
		color: #ffffff;
		font-size: 24rpx;
	}
	
	.balance-icon {
		background-color: #ff6b6b;
		color: #ffffff;
		font-size: 24rpx;
		font-weight: bold;
	}
	
	.icon-img {
		width: 100%;
		height: 100%;
	}
	
	.payment-details {
		flex: 1;
	}
	
	.payment-name {
		font-size: 30rpx;
		color: #333;
		font-weight: 500;
		margin-bottom: 5rpx;
	}
	
	.payment-desc {
		font-size: 24rpx;
		color: #666;
	}
	
	.payment-radio {
		width: 50rpx;
		height: 50rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	
	.payment-footer {
		padding-top: 20rpx;
	}
	
	.confirm-payment-btn {
		background-color: #4CAF50;
		color: #ffffff;
		font-size: 32rpx;
		font-weight: bold;
		padding: 25rpx;
		border-radius: 50rpx;
		text-align: center;
		width: 100%;
		box-sizing: border-box;
	}
	
	.radio-icon {
		width: 40rpx;
		height: 40rpx;
		border-radius: 50%;
		border: 2rpx solid #ccc;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: all 0.3s;
	}
	
	.radio-icon.selected {
		border-color: #4CAF50;
	}
	
	.radio-dot {
		width: 20rpx;
		height: 20rpx;
		border-radius: 50%;
		background-color: #4CAF50;
	}
	/* 输入支付密码 */
	.password-popup {
		padding: 30rpx;
		background-color: #ffffff;
	}
	.popup-title {
		font-size: 32rpx;
		font-weight: bold;
		color: #333;
		margin-bottom: 30rpx;
	}
	.password-input {
		width: 90%;
		border: 1rpx solid #ccc;
		border-radius: 10rpx;
		padding: 20rpx;
		margin-bottom: 30rpx;
	}
	.popup-btns {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.btn {
		width: 100rpx;
		height: 100rpx;
		border-radius: 10rpx;
		background-color: #4CAF50;
		color: #ffffff;
		font-size: 32rpx;
		font-weight: bold;
	}
	.btn.cancel {
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #888;
	}
	.btn.confirm {
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #4CAF50;
	}
	/* 收货地址 */
	.address-section {
	  background-color: #ffffff;
	  padding: 30rpx;
	  margin-bottom: 20rpx;
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	}
	.address-content {
	  display: flex;
	  align-items: center;
	  flex: 1;
	}
	.selected-address-content {
	  flex: 1;
	}
	.address-header {
	  display: flex;
	  align-items: center;
	  margin-bottom: 15rpx;
	}
	.address-label {
	  font-size: 28rpx;
	  color: #333;
	  font-weight: 500;
	  margin-left: 15rpx;
	}
	.address-info {
	  padding-left: 35rpx;
	}
	.user-info {
	  display: flex;
	  align-items: center;
	  margin-bottom: 8rpx;
	}
	.user-info .phone {
	  font-size: 26rpx;
	  color: #666;
	}
	.address-detail {
	  font-size: 26rpx;
	  color: #666;
	  line-height: 1.4;
	}
	
</style>
